const iconArrowLeft = document.querySelector('.icon-arrow-left')
const imgs= document.querySelector('.imgs')
const getCode = document.querySelector('.getCode')
const show = document.querySelector('.show')
const smt = document.querySelector('.smt')
const username = document.querySelector('[name="username"]')
const graph = document.querySelector('[name="graph"]')
const message = document.querySelector('[name="message"]')
iconArrowLeft.addEventListener('click',function () {
  history.back()
})
// 获取图形验证码
let Keys
function graphicCode() {
  axios.get('/captcha/image').then(({ data: res }) => { 
    console.log(res)
    Keys = res.data.key
    imgs.src = res.data.base64
  })
}
graphicCode()
//刷新验证码
imgs.addEventListener('click',function () {
  graphicCode()
})

//获取验证码
let flag = true
let gcode
getCode.addEventListener('click',function () {
  if (username.value.trim().length !== 11) { return alert('手机号规格不正确')}
  let i = 10;
  if (flag) {
    let timer = setInterval(() => {
     flag=false
      i--
     getCode.innerHTML = `${i}s再次获取`
     if (i === 0) { 
       clearInterval(timer)
       getCode.innerHTML = `获取验证码`
       flag = true
     }
    }, 1000)
    
    show.style.display = 'block'
    gcode=`${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}${parseInt(Math.random() * 10)}`
    show.innerHTML = `验证码为：${gcode}`
  }
})
// console.log(gcode)
smt.addEventListener('click', function (e) {
  e.preventDefault()
  if (username.value.trim().length !== 11) { return alert('手机号规格不正确')}
  else if (graph.value.trim().length !== 4) { return alert('图形验证码不正确') }
  else if (message.value !== gcode) { return alert('手机验证码不正确')}
  else if (message.value === gcode) {
        let user = {
          token: gcode,
          userPhone: username.value
        }
        alert("恭喜你，登录成功~");
        location.href='./wode.html'
        localStorage.setItem("message", JSON.stringify(user));
  }
})
